<template>
  <a-modal v-model:visible="modelVisible" @ok="handleOk" @cancel="handleCancel">
    <template #title> 面谈项目名称 </template>
    <a-form :model="formData" ref="refForm" :rules="rules" auto-label-width>
      <a-form-item label="名称" field="name" show-colon>
        <a-input v-model="formData.name"></a-input>
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script setup lang="ts">
import type { PerformanceInterviewRecordTemplateItem } from '@/apis/management/performance/baseSetting/assessmentSetting/type';
import { useVModel } from '@vueuse/core';
const props = withDefaults(
  defineProps<{
    visible?: boolean;
    data: PerformanceInterviewRecordTemplateItem;
  }>(),
  {
    visible: false
  }
);
const emit = defineEmits(['update:visible', 'update:data', 'add']);
const modelVisible = useVModel(props, 'visible', emit);
const formData = useVModel(props, 'data', emit);
const handleCancel = () => {
  modelVisible.value = false;
};
const handleOk = () => {
  emit('add');
  handleCancel();
};
const rules = reactive({
  name: [
    {
      required: true,
      message: '请输入'
    },
    {
      // validator: validateName
    }
  ]
});
</script>

<style lang="less" scoped>
.template-steps {
  padding: 0 160px;
  margin-bottom: 60px;
}
.modal-footer {
  display: flex;
  justify-content: center;
}
</style>
